
import {createElement,render,renderDom} from './virtualDom'
import domDiff from './domDiff'
import doPatch from './doPatch'


const vDom1 = createElement('ul',{class:'list',style:'width:100px;height:100px;background:#ccc'},[
    createElement('li',{class:'item','data-index' :0},[
        createElement('p',{class:'text'},['第一个列表'])
    ]),
    createElement('li',{class:'item','data-index':1},[
        createElement('p',{class:'text'},[
            createElement('span',{class:'title'},['第二个列表'])
        ])
    ]),
    createElement('li',{class:'item','data-index' :2},['第三个列表'])
])

const vDom2 = createElement('ul',{class:'warp-list',style:'width:200px;height:100px;background:#ccc'},[
    createElement('li',{class:'item','data-index' :0},[
        createElement('p',{class:'title'},['特殊列表项'])
    ]),
    createElement('li',{class:'item','data-index':1},[
        createElement('p',{class:'text'},[

        ])
    ]),
    createElement('div',{class:'item','data-index' :2},['第三个列表'])
])
const rDom = render(vDom1)
renderDom(
    rDom,
    document.getElementById('app')
    );


const patches = domDiff(vDom1,vDom2)

doPatch(rDom,patches)
// console.log(patches)
// console.log(vDom2) 
